<!DOCTYPE html>

<html>

<head>
<title>Mon test</title>
<link rel="stylesheet" href="test.css">
<meta charset="utf-8"
	content="blablab ne pas ommetre la thématique principale" />
	
<script type="text/javascript">
	function afficher(choix) {
		document.getElementById("color").innerHTML = choix;
	}
</script>

<style>

span {
	margin-right: 12px;
}

</style>

</head>
<body>
	<h1>ceci est un test</h1>

	<form action="">

		<label>Date départ : </label><input type="date" name="date_dep" /> <br />

		<label>Date Arrivée : </label><input type="date" name="date_arr" /> <br />


		couleur : <span id="color">x</span> <input type="color" id="color"
			onchange="afficher(this.value)"><br /> Quantité : <br /> <input
			name="quantite" type="range" min=0 max=10 step=1
			style="margin-top: 20 px;"> <br />

		<div style="margin-top: -2px;">
			<span style="margin-left: 2px;">0</span> <span>2</span> <span>4</span>
			<span>6</span> <span>8</span> <span>10</span>
		</div>

	</form>
</body>

</html>